<template>
  <div class="audit">
    <div class="card-container mb-5">
      <div class="audit-title">
        图片推送审核
        <Tag
          class="ml-2"
          :color="auditInfo.approveStatus == '2' ? 'green' : 'orange'"
          >{{ auditInfo.approveStatus == '2' ? '通过' : '待审核' }}</Tag
        >
      </div>
      <Row class="mb-2.5">
        <Col :span="6">
          <span class="audit-txt">创建时间</span>
          <span>{{ auditInfo.createTime }}</span>
        </Col>
        <Col :span="4">
          <span class="audit-txt">申请人</span>
          <span>{{ auditInfo.createBy }}</span>
        </Col>
        <Col :span="6">
          <span class="audit-txt">审核时间</span>
          <span>{{ auditInfo.auditTime ? auditInfo.auditTime : '--' }}</span>
        </Col>
        <Col :span="4">
          <span class="audit-txt">审核人</span>
          <span>{{ auditInfo.auditBy ? auditInfo.auditBy : '--' }}</span>
        </Col>
      </Row>
    </div>
    <div class="card-container">
      <Row :gutter="10">
        <Col :span="12">
          <span class="mr-5">设备类型</span>
          <span
            >{{deviceTypeEnum[auditInfo.deviceType as keyof typeof deviceTypeEnum]  }}</span
          >
          <p class="mta-2">
            <span class="mr-5">用途类型</span>
            <span>{{
        picUseTypeEnum[auditInfo.subType as keyof typeof picUseTypeEnum]
            }}</span>
          </p>
        </Col>
        <Col :span="12">
          <Flex>
            <span class="mr-5">所属项目</span>
            <div>
              <Tree
                :tree-data="auditInfo.projectTreeSelects"
                :field-names="fileNames"
                style="width: 280px"
              />
            </div>
          </Flex>
        </Col>
        <Col :span="12" class="mt-2">
          <Flex>
            <span class="mr-5">用途示例</span>
            <img
              :width="200"
              v-if="auditInfo.subType == '1'"
              src="@/assets/images/push/welcome.png"
            />
            <img
              :width="200"
              v-else-if="auditInfo.subType == '2'"
              src="@/assets/images/push/front.png"
            />
            <img :width="200" v-else src="@/assets/images/push/screen.png" />
          </Flex>
        </Col>
        <Col :span="12" class="mt-2">
          <p class="mb-2">
            <span class="mr-5">资料描述</span>
            <span>{{ auditInfo.dataDesc }}</span>
          </p>
          <Flex>
            <span class="w-[55px] mr-5">图片</span>
            <img class="w-[200px]" :src="uploadImg" />
          </Flex>
        </Col>
      </Row>
    </div>
  </div>
</template>
<script setup lang="tsx">
import { onMounted, reactive, ref } from 'vue';
import { Col, Flex, Row, Tag, Tree, TreeProps } from 'ant-design-vue';
import { deviceTypeEnum, picUseTypeEnum } from '@/constant/push';
import { idataManage } from '@/api/push';

const props = defineProps({
  audit: {
    type: Object,
    default: {},
  },
});
const auditInfo = props.audit;
const fileNames: TreeProps['fieldNames'] = {
  title: 'label',
};
const uploadImg = ref('');
onMounted(async () => {
  console.log(props.audit, '555555');
  let response = await idataManage(props.audit);
  uploadImg.value = 'data:image/png;base64,' + response;
});
</script>
<style lang="scss" scoped>
.audit-title {
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
}

.audit-txt,
p {
  margin-right: 12px;
  color: #fff;
}

.audit-code {
  margin: 10px 0;
  font-weight: bold;
}
</style>
